<template>
  <q-scroll-area style="height: 500px; max-width: 350px">
    <div class="my-text-overflow">
      <AmyMenuTabs
        :menu-list="menuList"
      />
    </div>
  </q-scroll-area>
</template>

<script lang="ts">
import { defineComponent, onMounted, computed } from 'vue';
import AmyMenuTabs from 'layouts/AmyMenuTabs.vue';
import { useCommonStore } from 'stores/commonStore';
import { storeToRefs } from 'pinia';
import { buildMenuTree } from 'src/hook/buildMenuTree';


export default defineComponent({
  name: 'AmyToolbox',
  components: {
    AmyMenuTabs
  },
  setup (props, context) {
    //vuex
    const store = useCommonStore();
    const {
      menu
    } = storeToRefs(store);

    //hook
    const {
      generateMenuTree
    } = buildMenuTree();

    //转换后菜单
    let menuList = computed(() => {
      return generateMenuTree(menu.value.list);
    });

    //挂载
    onMounted(() => {

    })

    return {
      menuList
    };
  }
});
</script>

<style lang="scss" scoped>

</style>
